@import './element-plus.scss';
@import './_variables.scss';

/* 全局样式定义 */
* {
  box-sizing: border-box;
}

a {
  color: inherit;
  text-decoration: none;
}

p {
  color: var(--primary-text-color, $primary-text-color);
}

body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.clearfix::after {
  display: table;
  clear: both;
  content: '';
}

.mask-zIndex99 {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100%;
  height: 100%;
  background-color: #0003;
}

.flex-justify-around {
  display: flex;
  justify-content: space-around;
}

.flex-justify-between {
  display: flex;
  justify-content: space-between;
}

.flex-justify-center {
  display: flex;
  justify-content: center;
}

.hover-shadow:hover {
  box-shadow: 0 4px 12px 0 #0000001a;
}

// css3 自定义滚动条 https://www.jianshu.com/p/c2addb233acd
// 自定义滚动条介绍 https://www.cnblogs.com/ranyonsue/p/9487599.html
::-webkit-scrollbar {
  z-index: 0;
  width: $scrollbar-width;
  height: $scrollbar-width;
}

::-webkit-scrollbar-thumb {
  background-color: #FAFAFA;
  border-radius: 4px;
  width: 4px;
}

::-webkit-scrollbar-track {
  //background-color: white;
}
//新增
.pageContent{
  background:#fff;
  position: relative;
  width: calc(100% - 30px);
  //min-width: 1024px;
  padding-bottom: 20px;
  // height: 86vh;
  overflow-y: auto;
  margin:15px;
}
 .centerAll {
    padding: 15px;
    max-width: 1980px;
  }

.formALL{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.formALL .el-input,.demo-ruleForm .el-input{
  // padding: 8px 15px;
  height: 32px;
}

.formALL .el-range-editor,.demo-ruleForm .el-range-editor{
  // padding: 8px 15px;
  height: 32px;
}
.formALL .el-button,.demo-ruleForm .el-button{
  // padding: 8px 15px;
  height: 32px;
}

/* 修改Element UI输入框placeholder的颜色和大小 */
.formALL .el-input__inner::-webkit-input-placeholder,.demo-ruleForm .el-input__inner::-webkit-input-placeholder {
  color: #b6bcc4; /* 修改为你想要的颜色 */
  font-size: 12px; /* 修改为你想要的大小 */
}

.formALL .el-input__inner:-moz-placeholder,.demo-ruleForm .el-input__inner:-moz-placeholder {
  color: #b6bcc4; /* 修改为你想要的颜色 */
  font-size: 12px; /* 修改为你想要的大小 */
}

.formALL .el-input__inner::-moz-placeholder,.demo-ruleForm .el-input__inner::-moz-placeholder {
  color: #b6bcc4; /* 修改为你想要的颜色 */
  font-size: 12px; /* 修改为你想要的大小 */
}

.formALL .el-select__placeholder.is-transparent,.demo-ruleForm .el-select__placeholder.is-transparent {
  color: #b6bcc4; /* 修改为你想要的颜色 */
  font-size: 12px; /* 修改为你想要的大小 */
}


/* 修改placeholder的颜色 */
.formALL .el-input__placeholder ,.demo-ruleForm   .el-input__placeholder{
  color: #b6bcc4; /* 将颜色改为红色 */
}

/* 修改placeholder的字体大小 */
.formALL .el-input__placeholder ,.demo-ruleForm  .el-input__placeholder {
  font-size: 16px; /* 将字体大小改为18px */
}

.formALL .el-textarea__inner::-webkit-input-placeholder  ,.demo-ruleForm .el-textarea__inner::-webkit-input-placeholder {
  /* Internet Explorer 10+ */
  color: #b6bcc4;
  font-size: 12px;
}


/*表单比不标签*/
 .bottomBtn{
   display:flex;
   justify-content: center;
 }
 .comPage{
   height: 68vh;
   overflow-y: auto;
 }

 .detailContainer {
   padding: 0 20px 20px;
   .title {
     color: rgba(0, 0, 0, 0.85);
     font-size: 16px;
     width: 100%;
     height: 60px;
     line-height: 60px;
     border-bottom: 1px solid #e8eaec;
     margin-bottom: 20px;
   }
   .bottomBtn {
     margin-top: 10px;
   }
 }
 // 通用样式
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.font-14 {
  font-size: 14px;
}
.font-12 {
  font-size: 12px;
}
.txt-color-85 {
  color: rgba(0, 0, 0, 0.85);
}
.txt-color-65 {
  color: rgba(0, 0, 0, 0.65);
}
.items-center {
  align-items: center;
}
.justify-start {
  justify-content: flex-start;
}
.content-start {
  align-content: flex-start;
}
.flex-wrap {
  flex-wrap: wrap;
}
.flex {
  display: flex;
}
.flex-1 {
  flex: 1 1 0;
}
.mb-8 {
 margin-bottom: 8px;
}
.mb-15 {
  margin-bottom: 15px;
}
.mb-20 {
  margin-bottom: 20px;
}
.mr-15 {
  margin-right: 15px;
}
.mr-20 {
  margin-right: 20px;
}
.mr-8 {
  margin-right: 8px;
}
.w-300 {
  width: 300px;
}
.w-80 {
  width: 80px;
}
.i-scrollbar-hide {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.overflow-ellipsis {
 text-overflow: ellipsis;
 white-space: nowrap;
 overflow: hidden;
}


.upLoadImg {
  position: relative;
  .close {
    position: absolute;
    right: -4px;
    top: -4px;
    font-size: 20px;
    z-index: 2;
  }
}
.el-button{
  font-weight: 400;
  font-size: 12px;
  padding: 7px 20px;
}
.el-button--danger{
  border-radius: 3px;
  background: #fa5757;
}
.el-button--primary{
  border-radius: 3px;
  background: #028FFF;
}

.el-form-item {
   font-weight: 300;
}
.el-form-item__label {
    color: rgba(0, 0, 0, .85)
  }
